<template>
	<view class="pages1">
		<view class="item1">
			<view class="itv1" @click="addsq()">授权理货员</view>
			<view class="itv1" @click="xgsq()">更改理货员</view>
			<view class="itv1" @click="wxlh()">无需理货</view>
		</view>
		<view class="item1">
			<view class="itv2">时间：{{timeStr}}</view>
			<view class="itv2">班次: {{dqbc.name1}}-{{dqbc.name2}}</view>
		</view>
		<view class="title1">当班状态列表</view>
		<view class="li1">
			<view class="lis1">委托单号</view>
			<view class="lis1">货主</view>
			<view class="lis1">状态</view>
			<view class="lis1">理货员</view>
		</view>
		<view style="overflow: auto;height: 200px;">
		<view class="li1" :class="{'itvs1':cur2==item.id}" v-for="(item,index) in list" :key="index">
				<view class="lis1" @click="xzwt(item)">{{item.orderons}}</view>
				<view class="lis1" @click="opens(item)">{{item.hzdwid}}</view>
				<view class="lis1">
					{{item.lhbbtype=="1"?"未授权":item.lhbbtype=="2"?"无需理货":item.lhbbtype=="3"?"已授权":item.lhbbtype }}
				</view>
				<view class="lis1">
					{{item.lhy}}
				</view>
		</view>
		<view class="li1" :class="{'itvs1':cur2==item.id}" v-for="(item,index) in list2" :key="index">
				<view class="lis1" @click="xzwt(item)">{{item.orderons}}</view>
				<view class="lis1" @click="opens(item)">{{item.hzdwid}}</view>
				<view class="lis1">
					{{item.lhbbtype=="1"?"未授权":item.lhbbtype=="2"?"无需理货":item.lhbbtype=="3"?"已授权":item.lhbbtype }}
				</view>
				<view class="lis1">
					{{item.lhy}}
				</view>
		</view>
				</view>
		<view class="title1">超时列表</view>
		<view>
			<view class="li1">
				<view class="lis1">委托单号</view>
				<view class="lis1">货主</view>
				<view class="lis1">状态</view>
				<view class="lis1">理货员</view>
			</view>
			<view style="overflow: auto;height: 200px;">
			<view class="li1"  :class="{'itvs1':cur2==item.id}"  v-for="(item,index) in cslist" :key="index">
				<view class="lis1"  @click="xzwt(item)">{{item.orderons}}</view>
				<view class="lis1" @click="opens(item)">{{item.hzdwid}}</view>
				<view class="lis1">
				{{ item.lhbbtype=="1"?"未授权":item.lhbbtype=="2"?"无需理货":item.lhbbtype=="3"?"已授权":item.lhbbtype }}
				</view>
				<view class="lis1">{{item.lhy}}</view>
			</view>
		</view>
		</view>
		<view v-show="opentype" class="ck">
			<view style="padding: 10px;margin-bottom: 10px; background-color: #3c77b7;overflow: hidden;">
				<view style="float: right;padding: 3px;font-size: 15px;color: #ffffff;font-weight: 600;"
					@click="opentypeqx">关闭</view>
			</view>
			<view style="padding: 10px;font-size: 15px;" class="iss">
				<view>委托单号：{{openinfo.orderons}}</view>
				<view>货主：{{openinfo.hzdwid}}</view>
				<view>货名：{{openinfo.hname}}</view>
				<view>操作过程：{{openinfo.czgc}}</view>
				<view>车队：{{openinfo.cdname}}</view>
				<view>船名：{{openinfo.shipnam}}</view>
				<view>授权时间：{{openinfo.sqstartime}}-{{openinfo.sqendtime}}</view>
				<view>理货员：{{openinfo.lhy}}</view>
				<view>状态：{{ openinfo.lhbbtype=="1"?"未授权":openinfo.lhbbtype=="2"?"无需理货":openinfo.lhbbtype=="3"?"已授权":openinfo.lhbbtype }}</view>
			</view>
		</view>
		<view v-show="sq" class="ck" style="border: 1px solid #3c77b7;">
			<view style="padding: 10px;margin-bottom: 10px; background-color: #3c77b7;overflow: hidden;">
				<view style="float: right;padding: 3px;font-size: 15px;color: #ffffff;font-weight: 600;"
					@click="qx">关闭</view>
			</view>
			<view style="overflow: hidden;border-bottom: 3px solid #3c77b7;padding-bottom: 10px;">
				<view @click="addxzlhy(1)" class="nav1" :class="{'itvs1':cur1==1}">一班</view>
				<view @click="addxzlhy(2)" class="nav1" :class="{'itvs1':cur1==2}">二班</view>
				<view @click="addxzlhy(3)" class="nav1" :class="{'itvs1':cur1==3}">三班</view>
				<view @click="addxzlhy(4)" class="nav1" :class="{'itvs1':cur1==4}">四班</view>
			</view>
			<view v-show="cur1==1" style="height: 300px;overflow: auto;">
				<view class="itv3" v-for="(item,index) in lhytypelist.data1" :key="index" @click="addlhyxz(item)"
					:class="{'itvs1':item.checked==true}">
					{{item.cname}}
				</view>
			</view>
			<view v-show="cur1==2" style="height: 300px;overflow: auto;">
				<view class="itv3" v-for="(item,index) in lhytypelist.data2" :key="index" @click="addlhyxz(item)"
					:class="{'itvs1':item.checked==true}">
					{{item.cname}}
				</view>
			</view>
			<view v-show="cur1==3" style="height: 300px;overflow: auto;">
				<view class="itv3" v-for="(item,index) in lhytypelist.data3" :key="index" @click="addlhyxz(item)"
					:class="{'itvs1':item.checked==true}">
					{{item.cname}}
				</view>
			</view>
			<view v-show="cur1==4" style="height: 300px;overflow: auto;">
				<view class="itv3" v-for="(item,index) in lhytypelist.data4" :key="index" @click="addlhyxz(item)"
					:class="{'itvs1':item.checked==true}">
					{{item.cname}}
				</view>
			</view>
			<view class="buts" @click="oklh">确认</view>
		</view>
		<view v-show="xg" class="ck" style="border: 1px solid #3c77b7;">
			<view style="padding: 10px;margin-bottom: 10px; background-color: #3c77b7;overflow: hidden;">
				<view style="float: right;padding: 3px;font-size: 15px;color: #ffffff;font-weight: 600;"
					@click="xggb">关闭</view>
			</view>
			<view style="overflow: hidden;border-bottom: 3px solid #3c77b7;padding-bottom: 10px;">
				<view @click="addxzlhy(1)" class="nav1" :class="{'itvs1':cur1==1}">一班</view>
				<view @click="addxzlhy(2)" class="nav1" :class="{'itvs1':cur1==2}">二班</view>
				<view @click="addxzlhy(3)" class="nav1" :class="{'itvs1':cur1==3}">三班</view>
				<view @click="addxzlhy(4)" class="nav1" :class="{'itvs1':cur1==4}">四班</view>
			</view>
			<view v-show="cur1==1" style="height: 300px;overflow: auto;">
				<view class="itv3" v-for="(item,index) in xglhytypelist.data1" :key="index" @click="editlhyxz(item)"
					:class="{'itvs1':item.checked==true}">
					{{item.cname}}
				</view>
			</view>
			<view v-show="cur1==2" style="height: 300px;overflow: auto;">
				<view class="itv3" v-for="(item,index) in xglhytypelist.data2" @click="editlhyxz(item)"
					:class="{'itvs1':item.checked==true}">
					{{item.cname}}
				</view>
			</view>
			<view v-show="cur1==3" style="height: 300px;overflow: auto;">
				<view class="itv3" v-for="(item,index) in xglhytypelist.data3" @click="editlhyxz(item)"
					:class="{'itvs1':item.checked==true}">
					{{item.cname}}
				</view>
			</view>
			<view v-show="cur1==4" style="height: 300px;overflow: auto;">
				<view class="itv3" v-for="(item,index) in xglhytypelist.data4" :key="index" @click="editlhyxz(item)"
					:class="{'itvs1':item.checked==true}">
					{{item.cname}}
				</view>
			</view>
			<view class="buts" @click="okeditlh">确认</view>
		</view>

		<tabBar :pagePath="'/pages/shoquan/pzcdlh'"></tabBar>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				uinfo: '',
				timeStr: new Date().toISOString().slice(0, 10),
				lhytypelist: [],
				dqbc: '',
				cur1: 1,
				sq: false,
				sqinfo: '',
				cur2:'',
				xz:[],
				list:[],
				list2:[],
				cslist:[],
				xg:false,
				xglhytypelist: [],
				opentype:false,
				openinfo:''
			};
		},
		async onLoad() {
			this.getbancitimedqs();
			this.getbclhbbuserall();
		},
		methods: {
			opentypeqx(){
				this.opentype = false
			},
			opens(e){
				this.opentype = true
				this.openinfo = e
			},
			wxlh(){
				let sqinfo = this.sqinfo
				if(sqinfo==''){
					uni.showToast({
						title: '请选中后在操作',
						icon: 'none',
						duration: 2000
					});
					return false;
				}
				
				let that = this
				uni.showModal({
					cancelText: "取消", // 取消按钮的文字  
					confirmText: "确认", // 确认按钮文字 
					title: '授权提升',
					content: '是否设置为无需理货?',
					confirmColor: '#3B8BFF',
					cancelColor: '#222222',
					success: res => {
						//that.delyuy(e);
						if (res.confirm) {
							that.editlhtype();
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
						console.log(res)
					}
				});
			},
			async editlhtype(){
				let data = {
					id:this.sqinfo.id
				}
				let res = await this.$api.editlhtype(data);
				if(res.data.code==0){
					
					//log
					let data1 = {
						uid:uni.getStorageSync('uid'),
						msg:'超时授权理货员给委托单号'+this.sqinfo.orderons+'无需理货'+'班次'+this.dqbc.id,
						lv:1,
						type:4,
						cz:JSON.stringify(this.sqinfo)
					}	
					await this.$api.addlogs(data1)
					this.sqinfo = ''
					this.cur2 =  ''
					this.getlhbcorderons();
					this.getlhbcorderonscs();
				}else{
					uni.showToast({
						title: res.data.msg,
						icon: 'none',
						duration: 2000
					});
				}
			},
			//修改
			xgsq(){
				if(this.sqinfo!=''){
					this.getlhyeditall();
					this.xg = true
				}else{
					uni.showToast({
						title: '请选中后在操作',
						icon: 'none',
						duration: 2000
					});
					return false;
				}
			},
			xggb(){
				this.xg = false
			},
			//获取修改理货员数据
			async getlhyeditall(){
				let sqinfo = this.sqinfo
				this.xz = sqinfo.lhidall
				console.log(this.xz)
				let data = {
					lhid:sqinfo.lhbbid
				}
				let res = await this.$api.getlhyeditall(data);	
				if(res.data.code==0){
					this.xglhytypelist = res.data.data
				}	
					
			},
			xzwt(e){
				this.sqinfo = e
				this.cur2 = e.id
			},
			addsq(e) {
				if(this.sqinfo!=''){
					this.getbclhbbuserall();
					this.xz = [];
					this.sq = true
				}else{
					uni.showToast({
						title: '请选中后在操作',
						icon: 'none',
						duration: 2000
					});
					return false;
				}	
			},
			qx() {
				this.sq = false
			},
			//确认分配理货员
			async oklh(){
				console.log(1223213)
				let sqinfo = this.sqinfo
				console.log(this.sqinfo)
				console.log(this.xzid)
				if(this.xz.length>2 || this.xz.length<0 || this.xz.length==0){
					uni.showToast({
						title: '请先择两位理货员!',
						icon: 'none',
						duration: 2000
					});
					return false;
				}
				let data = {
					lhbbid: this.xz,
					id: this.sqinfo.id,
					lhbc: this.dqbc.id
				}
				let res = await this.$api.editlhy(data);
				if (res.data.code == 0) {
				
					let data1 = {
						uid:uni.getStorageSync('uid'),
						msg:'授权理货员给委托单号'+this.sqinfo.orderons+'理货员'+this.xz+'班次'+this.dqbc.id,
						lv:1,
						type:4,
						cz:JSON.stringify(this.sqinfo)
					}	
					await this.$api.addlogs(data1)
					this.sqinfo = ""
					this.cur2 = ""
					this.sq = false
					this.getlhbcorderons();
					this.getlhbcorderonscs();
				} else {
					uni.showToast({
						title: res.data.msg,
						icon: 'none',
						duration: 2000
					});
				}
			},
			async okeditlh(){
					let sqinfo = this.sqinfo
					console.log(this.sqinfo)
					console.log(this.xzid)
					if(this.xz.length>2 || this.xz.length<0 || this.xz.length==0){
						uni.showToast({
							title: '请先择两位理货员!',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					let data = {
						lhbbid: this.xz,
						id: this.sqinfo.id,
						lhbc: this.dqbc.id
					}
					let res = await this.$api.editlhy(data);
					if (res.data.code == 0) {
						
						//log
						let data1 = {
							uid:uni.getStorageSync('uid'),
							msg:'超时授权理货员给委托单号'+this.sqinfo.orderons+'理货员'+this.xz+'班次'+this.dqbc.id,
							lv:1,
							type:4,
							cz:JSON.stringify(this.sqinfo)
						}	
						await this.$api.addlogs(data1)
						this.sqinfo = ""
						this.cur2 = ""
						this.xg = false
						this.getlhbcorderons();
						this.getlhbcorderonscs();
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none',
							duration: 2000
						});
					}
			},
			
			addlhyxz(e) {
				// console.log(e)
				//判断当前选中的理货员数量
					console.log(this.xz)
					if (this.xz.indexOf(e.id) >= 0) {
						console.log("元素存在");
						console.log(this.xz.indexOf(e.id));
						this.xz.splice(this.xz.indexOf(e.id),1)
						console.log(this.xz);
					} else {
						console.log("元素不存在");
						if(this.xz.length>2 || this.xz.length==2){
							uni.showToast({
								title: '理货员不能超过2位',
								icon: 'none',
								duration: 2000
							});	
							return false
						}
						this.xz.push(e.id)
						console.log(this.xz);
					}
					
					if (this.cur1 == 1) {
						this.lhytypelist.data1.forEach(item => {
							if (e.id == item.id) {
								if (item.checked == true) {
									this.$set(item, 'checked', false)
								} else {
									this.$set(item, 'checked', true)
								}
							}
						});
					} else if (this.cur1 == 2) {
						this.lhytypelist.data2.forEach(item => {
							if (e == item) {
								if (item.checked == true) {
									this.$set(item, 'checked', false)
								} else {
									this.$set(item, 'checked', true)
								}
							}
						});
					} else if (this.cur1 == 3) {
						this.lhytypelist.data3.forEach(item => {
							if (e == item) {
								if (item.checked == true) {
									this.$set(item, 'checked', false)
								} else {
									this.$set(item, 'checked', true)
								}
							}
						});
					} else if (this.cur1 == 4) {
						this.lhytypelist.data4.forEach(item => {
							if (e == item) {
								if (item.checked == true) {
									this.$set(item, 'checked', false)
								} else {
									this.$set(item, 'checked', true)
								}
							}
						});
					}
			},
			editlhyxz(e){
				// console.log(e)
				//判断当前选中的理货员数量
					console.log(this.xz)
					if (this.xz.indexOf(e.id) >= 0) {
						console.log("元素存在");
						console.log(this.xz.indexOf(e.id));
						this.xz.splice(this.xz.indexOf(e.id),1)
						console.log(this.xz);
					} else {
						console.log("元素不存在");
						if(this.xz.length>2 || this.xz.length==2){
							uni.showToast({
								title: '理货员不能超过2位',
								icon: 'none',
								duration: 2000
							});	
							return false
						}
						this.xz.push(e.id)
						console.log(this.xz);
					}
					if (this.cur1 == 1) {
						this.xglhytypelist.data1.forEach(item => {
							if (e.id == item.id) {
								if (item.checked == true) {
									this.$set(item, 'checked', false)
								} else {
									this.$set(item, 'checked', true)
								}
							}
						});
					} else if (this.cur1 == 2) {
						this.xglhytypelist.data2.forEach(item => {
							if (e == item) {
								if (item.checked == true) {
									this.$set(item, 'checked', false)
								} else {
									this.$set(item, 'checked', true)
								}
							}
						});
					} else if (this.cur1 == 3) {
						this.xglhytypelist.data3.forEach(item => {
							if (e == item) {
								if (item.checked == true) {
									this.$set(item, 'checked', false)
								} else {
									this.$set(item, 'checked', true)
								}
							}
						});
					} else if (this.cur1 == 4) {
						this.xglhytypelist.data4.forEach(item => {
							if (e == item) {
								if (item.checked == true) {
									this.$set(item, 'checked', false)
								} else {
									this.$set(item, 'checked', true)
								}
							}
						});
					}
			},
			
			
			
			
			addxzlhy(e) {
				this.cur1 = e
			},
			//确认选中理货员
			lhyqr() {
				let wxlh = this.wxlh
				if (wxlh == 2) {
					console.log(this.items)
					let xzsjidall = []
					let xzid = []
					this.items.forEach(item => {
						if (item.checked == true) {
							console.log(item)
							xzsjidall.push(item);
							xzid.push(item.id)
						}
					});
					if (xzid.length > 2) {
						uni.showToast({
							title: '理货员不能超过2位',
							icon: 'none',
							duration: 2000
						});
					} else {
						this.xzsjidall = xzsjidall
						this.sqinfo.lhbbidlist = xzsjidall
						this.xzid = xzid
						console.log(xzid);
						this.lhy = false
					}
				}
			},
			qxlhy() {
				this.lhy = false
			},
			async getbclhbbuserall(e) {
				let data = {
					bc: e
				}
				let res = await this.$api.getbclhbbuserall(data);
				console.log(res.data)
				this.lhytypelist = res.data.data
			},
			async getbancitimedqs() {
				let res = await this.$api.getbancitimedqs();
				console.log(res.data)
				this.dqbc = res.data
				this.init()
			},
			checkboxChange: function(e) {
				console.log(e)
				if (e.detail.value[0] == 1) {
					this.wxlh = e.detail.value[0]
				} else {
					this.wxlh = 2
				}
			},
			async wcsqlh() {
				let sqinfo = this.sqinfo
				let xzid = this.xzid
				console.log(this.sqinfo)
				console.log(this.xzid)
				let data = {
					lhbbid: xzid,
					id: sqinfo.hzsqid,
					wxlh: this.wxlh,
					lhbc: this.dqbc.id
				}
				let res = await this.$api.editlhtype(data);
				if (res.data.code == 0) {
					this.sq = false
					this.getlhbcorderons(this.dqbc.id);
					this.getlhbcorderonscs(this.dqbc.id);
				} else {
					uni.showToast({
						title: res.data.msg,
						icon: 'none',
						duration: 2000
					});
				}
			},
	

			//根据预约单号获取授权车队
			async getorderonscdlist(e) {
				let data = {
					orderons: e
				}
				let res = await this.$api.getorderonscdlist(data)
				console.log(res.data.data)
				if (res.data.code == 0) {
					this.cdlist = res.data.data
				}
			},

			//获取当班预约单号和获取当前授权的理货员
			async getlhbcorderons(e) {
				let data = {
					bc: e
				}
				let res = await this.$api.getlhbcorderons(data)
				console.log(res.data.data)
				if (res.data.code == 0) {
					console.log(res.data.data)
					this.list = res.data.data
					// .arr1
					// this.list2 = res.data.data.arr2
				}
			},
			async getlhbcorderonscs(e) {
				let data = {
					bc: e
				}
				let res = await this.$api.getlhbcorderonscs(data)
				console.log('超时列表')
				console.log(res.data.data)
				if (res.data.code == 0) {
					this.cslist = res.data.data
				}
			},


			bindPickerChange3: function(e) {
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.index1 = e.target.value
				let bcid = this.array3[this.index1];
				this.getbaclihuy(bcid);
			},
			bindPickerChange1: function(e) {
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.index1 = e.target.value
				///let bcid =  this.list1[this.index1].id;
				//this.getbaclihuy(bcid);
			},

			bindPickerChange: function(e) {
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.index = e.target.value

			},
			async init() {
				let data = {
					id: uni.getStorageSync('uid')
				}
				let res = await this.$api.getuserinfo(data)
				console.log(res.data.code)
				if (res.data.code == 0) {
					this.uinfo = res.data.data
					this.getlhbcorderons(this.dqbc.id);
					this.getlhbcorderonscs(this.dqbc.id);
					// this.getbancifind(this.uinfo.zbzrlhbb);
					// this.getbancitimedqs();

				}
			},








		}
	}
</script>

<style lang="less" scoped>
	.pages1 {
		background-color: #ffffff;
		margin-bottom: 30px;
	}

	.item1 {
		height: 50px;
		overflow: hidden;
		margin-bottom: 10px;
		margin-top: 10px;
	}

	.itv1 {
		border: 3px solid #3c77b7;
		height: 50px;
		line-height: 50px;
		text-align: center;
		font-size: 20px;
		width: 30%;
		margin-left: 10px;
		float: left;
		border-radius: 10px;
	}

	.itv2 {
		border: 3px solid #3c77b7;
		height: 50px;
		line-height: 50px;
		text-align: center;
		font-size: 20px;
		width: 48%;
		margin-left: 5px;
		float: left;
		border-radius: 10px;
	}

	.title1 {
		border-bottom: 3px solid #3c77b7;
		text-align: center;
		line-height: 60px;
		height: 60px;
		font-size: 20px;
	}

	.li1 {
		border-bottom: 1px solid #3c77b7;
		overflow: hidden;
		font-size: 15px;
		height: 50px;
		border-radius: 10px;
	}

	.lis1 {
		height: 50px;
		line-height: 50px;
		float: left;
		text-align: center;
		width: 25%;
		font-size: 16px;
		border: 1px solid #3c77b7;
		overflow: hidden;   //隐藏
		border-radius: 10px;
	}

	.itv3 {
		width: 46%;
		border: 1px solid #3c77b7;
		height: 40px;
		line-height: 40px;
		text-align: center;
		font-size: 18px;
		border-radius: 10px;
		margin-top: 10px;
		margin-left: 5px;
		float: left;
	}

	.ck {
		z-index: 999;
		-moz-opacity: 1;
		opacity: 1;
		// border: 1px solid #000000;
		position: fixed;
		background-color: #ffffff;
		width: 90%;
		border-radius: 5px;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		//padding: 10upx;
	}

	.buts {
		width: 80%;
		height: 40px;
		line-height: 40px;
		text-align: center;
		background-color: #3c77b7;
		color: #ffffff;
		font-size: 20px;
		font-weight: 600;
		margin: 0 auto;
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.nav1 {
		border: 3px solid #3c77b7;
		float: left;
		height: 50px;
		line-height: 50px;
		width: 20%;
		text-align: center;
		font-size: 18px;
		margin-left: 5px;
		border-radius: 10px;
	}

	.itvs1 {
		background-color: #3c77b7;
		color: #ffffff;
	}
	.iss view{
		font-size: 15px;
		height: 30px;
		line-height: 30px;
	}
</style>
